<template>
	<view class="appeal">
		<view class="edit">
			<textarea maxlength="255" :disabled="isDisabled" v-model="content" placeholder="请详细描述申诉内容" />
		</view>
		<view class="remarks">
			<text>*</text>
			<text>您提交的资料将有助于申诉成功，请认真填写</text>
		</view>
		<view class="lists-img">
			<block-upload ref="upload" :uploadFiles="uploadFiles" :isDisabled="isDisabled" 
			@uploadFiles="uploadChange"></block-upload>
		</view>
		<view class="remarks">
			<text>*</text>
			<text>上传凭证截图</text>
		</view>
		<view class="remarks fail-content" v-if="complete_status===6">
			<text>{{fail_content}}</text>
		</view>
		<view class="btn">
			<button type="default" :disabled="isDisabled" @click="submit()">提交</button>
		</view>
	</view>
</template>

<script>
	import BlockUpload from "@/components/BlockUpload/BlockUpload.vue"
	import {appeal,seeAppeal} from "@/api/reward.js"
	export default {
		name: "appeal",
		components: {
			BlockUpload
		},
		data() {
			return {
				isDisabled:true,
				id:'',
				content:"",
				uploadFiles:[],
				fail_content:"",
				complete_status:0,
			};
		},
		onLoad(option) {
			this.id = option.id
			this.seeAppeal();
		},
		methods: {
			async seeAppeal(){
				let res = await seeAppeal({id:this.id})
				if(res.code === 1){
					if(res.data.appeal_detail){
						let data = JSON.parse(res.data.appeal_detail);
						this.content = data.content
						this.uploadFiles=data.uploadFiles
						this.fail_content = res.data.fail_content
						this.complete_status = res.data.complete_status
						this.isDisabled = true
					}else{
						this.isDisabled = false
					}
				}
			},
			uploadChange(fileList) {
				this.uploadFiles = fileList;
			},
			async submit(){
				if(!this.content){
					this.$msg("请描述你要申诉的内容")
					return;
				}
				if(!this.uploadFiles.length){
					this.$msg("请上传申诉凭证")
					return;
				}
				let obj = JSON.stringify({
					content:this.content,
					uploadFiles:this.uploadFiles
				})
				let res = await appeal({id:this.id,appeal_detail:obj})
				if(res.code === 1){
					this.seeAppeal();
				}
				this.$msg(res.msg)
			}
		}
	}
</script>

<style scoped lang="less" src="./appeal.less">
</style>
